<template>
  <div class="model-config">
    <el-form ref="formRef" :model="form" label-width="120px">
      <el-form-item label="模型值">
        <el-input v-model="form.modelValue"></el-input>
      </el-form-item>
      <el-form-item label="服务器地址">
        <el-input v-model="form.url"></el-input>
      </el-form-item>
      <el-form-item label="Key">
        <el-input v-model="form.apiKey"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="saveConfig">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup>
import {onMounted, reactive} from 'vue'
import http from "@/utils/request.js";
import {ElMessage} from "element-plus";

const form = reactive({
  modelValue: '',
  url: '',
  apiKey: ''
})

const saveConfig = async () => {
  console.info('保存配置', form)
  // 此处可以加入保存逻辑，例如调用接口保存配置
  const res = await http.post("/config/setModelConfig", form);
  if (res.code === 200) {
    ElMessage({
      message: '更新数据成功',
      type: 'success',
    })
  }
}

onMounted(async () => {
  const res = await http.post("/config/getModelConfig", {});
  if (res.code === 200) {
    Object.assign(form, res.data)
  }
})
</script>

<style scoped>
.model-config {
  padding: 20px;
}
</style>
